<!DOCTYPE html>
<html>
<head>
    <head/>
    <div th:include="base-libs :: base-libs"/>
    <title>字典管理</title>
    <style type="text/css">
    </style>
</head>
<script type="text/javascript">
    $(function () {
        enterToQuery(queryForm);
        initView();
    });

    function queryForm() {
        $("#dgForm").datagrid("reload");
    }

    function initView() {
        var opt = {
            idField: "ZDBM",
            uniqueId: "ZDBM",
            striped: true,
            border: false,
            toolbar: "#dgFormToolbar",
            clickToSelect: true,
            columns: [[
                {
                    field: "ZDBM",
                    width: 8,
                    align: "center",
                    title: "字典编号"
                },
                {
                    field: "ZDMC",
                    width: 8,
                    align: "center",
                    title: "字典名称"
                },
                {
                    field: "ZDSM",
                    width: 16,
                    align: "center",
                    title: "字典说明"
                },
                {
                    field: "SFDJZY",
                    width: 4,
                    align: "center",
                    title: "是否单级值域",
                    formatter: function (value, row, index) {
                        if (value == "0") {
                            value = "否";
                        }
                        else if (value == "1") {
                            value = "是";
                        }
                        return value;
                    }
                },
                {
                    field: "cz",
                    width: 10,
                    align: "center",
                    title: "操作",
                    formatter: operateFormatter
                }
            ]]
            , pagination: true
            , pageNumber: 1
            , pageSize: 10
            , fit: true
            , fitColumns: true
            , singleSelect: true
            , rownumbers: true
            , method: "post"
            , url: contextRoot + "zdgl/queryPage.service"
            , onBeforeLoad: function (params)//加载之前回调 获取查询条件
            {
                params["ZDMC"] = $("#ZDMC").val();
                return params;
            }
        };
        $("#dgForm").datagrid(opt);
        $("#dgForm").datagrid("fitColumns");

        //新增字典记录
        $("#btnAdd").on("click", function () {
            parent.layer.open({
                type: 1,
                area: ["80%", "280px"], //宽高
                scrollbar: false,
                resize: false,
                content: $("#insertDiv").html(),
                btn: ["确定", "取消"],
                yes: function (index, layero) {
                    if ($(layero).find(".form-control").QuickValidate()) {
                        var ZDBM = $(layero).find(".ZDBM").val();
                        var ZDMC = $(layero).find(".ZDMC").val();
                        var ZDSM = $(layero).find(".ZDSM").val();
                        var SFDJZY = $(layero).find(".SFDJZY").val();
                        $.QuickRemote.AjaxFiledFormSubmit("insertForm", function (result) {
                            var info = result["info"];
                            if (result["state"]) {
                                $.QuickAlert.alertNormal("操作成功！", {
                                    callback: function () {
                                        parent.layer.close(index);//这块是点击确定关闭这个弹出层
                                        $("#btnQuery").trigger("click");
                                    }
                                });
                            } else {
                                $.QuickAlert.alertFail({
                                    content: info["faultInfo"]
                                });
                            }
                        }, {"ZDBM": ZDBM, "ZDMC": ZDMC, "ZDSM": ZDSM, "SFDJZY": SFDJZY});
                    }
                }
            });
        });
    }

    /**操作格式化*/
    function operateFormatter(value, row, index) {
        var tool = $("#tableToolBar").html();
        return tool.replace(/#zdbm#/g, row["ZDBM"]).replace(/#sfdjzy#/g, row["SFDJZY"]);
    }

    /**查询按钮点击回调*/
    function btnQueryHandler() {
        queryForm();
    }

    /**修改按钮*/
    function update(zdbm, sfdjzy) {
        //StoreCache.setCache("ZDGL_TABLE_INFO", {ZDBM : zdbm, SFDJZY: sfdjzy});
        $.QuickUrlUtils.redirectUrl("manager.html?ZDBM=" + zdbm + "&SFDJZY=" + sfdjzy);
    }

    /**删除按钮*/
    function remove(zdbm) {
        $.QuickAlert.alertConfirm({
            content: "确认是否删除字典表？", callback: function () {
                $.QuickRemote.AjaxFiledFormSubmit("removeForm", function (result) {
                    var info = result["info"];
                    if (result["state"]) {
                        $.QuickAlert.alertNormal("删除成功！", {
                            callback: function () {
                                $("#btnQuery").trigger("click");
                            }
                        });
                    } else {
                        $.QuickAlert.alertFail({
                            content: info["faultInfo"]
                        });
                    }
                }, {ZDBM: zdbm});
            }
        });
    }
</script>

<body class="easyui-layout" data-options="fit:true">
<div region="north" style="border: none; overflow: hidden;">
    <h4 class="h4-title" style="margin:0;padding:0;font-size: 22px;">
        字典管理
    </h4>
</div>
<div region="center" style="border: none;">
    <form action="delete" id="removeForm"></form>
    <form action="insert" id="insertForm"></form>
    <div id="dgFormToolbar" style="background: white;">
        <table class="form-table" style="margin:0;padding:0;">
            <tr>
                <td class="td-text">字典名称：</td>
                <td class="td-content">
                    <input id="ZDMC" name="ZDMC" class="form-control" type="text"
                           placeholder="字典名称">
                </td>
                <td class="td-text" style="text-align:center;">
                    <button id="btnQuery" class="btn btn-info" type="button"
                            onclick="btnQueryHandler()">查询
                    </button>
                </td>
            </tr>
        </table>
        <div style="margin:10px 10px auto 0px;">
            <button id="btnAdd" class="btn-info" type="button">添加字典</button>
        </div>
    </div>
    <div class="easyui-layout" style="border: none;">
        <div region="center" style="border: none;">
            <table id="dgForm">
            </table>
        </div>
    </div>
</div>
</body>
<script type="text/html" id="tableToolBar">
    <a class="start tableToolBarBtn" href="javascript:update('#zdbm#','#sfdjzy#')" title="修改">修改</a>
    <a class="start tableToolBarBtn" href="javascript:remove('#zdbm#')" title="删除">删除</a>
</script>
<script type="text/html" id="insertDiv">
    <div class="easyui-layout">
        <div region="north" style="border: none; overflow: hidden;">
            <h4 class="h4-title" style="font-size: 28px;text-align:center;">
                字典表目录信息
            </h4>
        </div>
        <div region="center" style="border: none">
            <div class="form-table-box">
                <form id="managerForm" action="" class="form-horizontal">
                    <table class="form-table">
                        <tr>
                            <td class="td-text">字典编号：</td>
                            <td class="td-content">
                                <input name="ZDBM" class="form-control ZDBM" type="text"
                                       quick-config="label:'字典编号', validateProxy:'notNull length', length: '20'"
                                       placeholder="字典编号">
                            </td>
                            <td class="td-text">字典名称：</td>
                            <td class="td-content">
                                <input name="ZDMC" class="form-control ZDMC" type="text"
                                       quick-config="label:'字典名称', validateProxy:'notNull length', length: '25'"
                                       placeholder="字典名称">
                            </td>
                        </tr>

                        <tr>
                            <td class="td-text">字典说明：</td>
                            <td class="td-content">

                                <input name="ZDSM" class="form-control ZDSM" type="text"
                                       quick-config="label:'字典说明', validateProxy:'notNull length', length: '50'"
                                       placeholder="字典说明">
                            </td>
                            <td class="td-text">是否单级值域：</td>
                            <td class="td-content">
                                <select class="form-control SFDJZY" name="SFDJZY"
                                        quick-config="label:'是否单级值域', validateProxy:'notNull'">
                                    <option value="1">是</option>
                                    <option value="0">否</option>
                                </select>
                            </td>
                        </tr>
                    </table>
                </form>
            </div>
        </div>
</script>
</html>



